import Vue from "vue";
import VueRouter from "vue-router";
import routes from "./routes";
import NProgress from "nprogress";
import "nprogress/nprogress.css";
import store from "@/store";
Vue.use(VueRouter);

const router = new VueRouter({
  mode: "history",
  routes,
  /* 
    scrollBehavior:可以在路由切换的时候,修改滚动条位置
    scrollBehavior函数内部的return的对象中x代表x轴位置,y代表y轴位置
    scrollBehavior接受to和from作为参数,代表要去的route和来的route
  */
  scrollBehavior() {
    return {
      x: 0,
      y: 0,
    };
  },
});

//我们的目标是路由切换后显示进度条,使用路由守卫来完成进度条
router.beforeEach(async (to, from, next) => {
  NProgress.start();
  const token = store.state.user.token;
  const nickname = store.state.user.userInfo.nickname;
  // console.log(store);
  if (token) {
    //如果有token就判断去的地方是不是登录页, 如果是则直接导航到首页
    if (to.name === "Login") {
      next("/home");
    }
    if (nickname) {
      next();
    } else {
      try {
        await store.dispatch("user/getUserInfo");
        //请求用户信息成功
        next();
      } catch (e) {
        //catch说明请求用户信息失败
        //此时说明token有问题,赶紧把token删掉,并重新登录
        store.commit("user/CLEAR_USER");
        // next("/login");
        next(`/login?to=${to.name}`);
        //因为要导航到login 判断来得地方也是login的话 就不会进入全局后置钩子  所以需要手动关闭进度条
        if (from.name === "Login") NProgress.done();
      }
    }
  } else {
    //如果没有token,那么就检测要去的地址是否需要授权(meta) , 如果需要就next跳转去login登录,如果不需要就放行
    if (to.meta.isAuth) {
      // next("/login");
      next(`/login?to=${to.name}`);
      //因为要导航到login 判断来得地方也是login的话 就不会进入全局后置钩子  所以需要手动关闭进度条
      if (from.name === "Login") NProgress.done();
    } else {
      next();
    }
  }
});
router.afterEach(() => {
  NProgress.done();
});
export default router;
